var ACRD_ID = 'product-accordion';

$(function(){
	initGroupHeader($('.accordion > h2'));
	
	$('.accordion').accordion({
		heightStyle: 'content',
		create: function(e, ui) {
			var indx = getAccordionIndex(ACRD_ID);
			$(this).accordion('option', 'active', indx);
			loadAccordionContent(indx);
			$(this).css('visibility','visible');
		},
		activate: function(e,ui) {
			var indx = $(this).accordion('option', 'active');
			setAccordionIndex(ACRD_ID, indx);
			
			loadAccordionContent(indx);
		},
		active: getAccordionIndex(ACRD_ID)
	});
});

function initGroupHeader(headers) {
	headers.dblclick(function(e){
		var h    = $(this);
		if (h.hasClass('editing')) return;
		h.addClass('editing');
		
		var id   = h.attr('data-id');
		var name = h.attr('data-name');
		
		var span = h.children('.label');
		
		$(this).unbind('keydown');
		
		var clone = $('#add-group')
						.clone()
						.show()
						.removeAttr('id');
		span.html(clone)
		clone.data('group-id',   id);
		clone.data('group-name', name);
		setGroupFormEvents(clone);
		
		clone.find('input')[0].focus();
		return false;
	});
}

function loadAccordionContent(indx) {
	indx = indx>0 ? indx : 0;
	var div = $('.accordion div.ui-accordion-content').eq(indx);
	var h2  = div.prev();
	
	if (! div.children().length) {
		$.ajax({
			url: '/admin_proizvodi/grupa/' + h2.attr('data-id'),
			beforeSend: function() {
				div.addClass('loading');
			},
			complete: function(req) {
				div.removeClass('loading');
				
				if (req.status == 200) {
					div.html(req.responseText);
				} else {
					div.html(req.status + '. ' + req.statusText);
				}
			}
		})
	}
}

function addProduct(groupId) {
	productForm('/admin_proizvodi/create/' + groupId, 'Novi Proizvod');
}
function editProduct(id) {
	productForm('/admin_proizvodi/edit/' + id, 'Izmena Proizvoda');
}
function productForm(url, title) {
	formRemoteDialog(url, {
		'Sačuvaj': function() {
			formDialogSubmit($(this));
		}
	}, {
		title: title,
		height: 550
	});
}

function addGroup() {
	var tpl = $('#add-group');
	var btn = $('#add-group-btn');
	
	setGroupFormEvents(tpl);
	
	btn.hide();
	tpl
		.show()
		.find('input').focus();
}
function editGroup(id, name) {
	$('h2.group-' + id).dblclick();
}
function setGroupFormEvents(span) {
	var inpt   = span.children('input');
	var save   = span.children('.save');
	var cancel = span.children('.cancel');
	
	var name = span.data('group-name');
	inpt
		.val(name)
		.keydown(function(e){
			var inpt = $(this).siblings('input');
			var code = e.keyCode;
			
			switch (code) {
			case 13:
				$(this).siblings('.action.save').click();
				break;
				
			case 27:
				$(this).siblings('.action.cancel').click();
				break;
				
			default:
				//inpt.val(inpt.val() + String.fromCharCode(code));
				break;
			}
			
			return true;
		});
		
	save
		.click(function(){
			var id      = $(this).parent().data('group-id');
			var newName = $(this).siblings('input').val();
			if (newName.length > 0) {
				saveGroup(id, newName);
			} else {
				$(this).siblings('.cancel').click();
			}
		});
	
	cancel
		.click(function(){
			var span = $(this).parent();
			var name = span.data('group-name');
			var h    = span.parent().parent();
			
			h.removeClass('editing');
			if (h.hasClass('ui-accordion-header')) {
				span.html(name);
			} else {
				span.hide();
				$('#add-group-btn').show()
			}
		});
}
function saveGroup(id, name) {
	PUT('/admin_proizvodi/save_group', {data: {
		Group: {
			id:   id,
			name: name
		}
	}}, function(req){
		hideThrobber();
		if (req.status == 200) {
			location.reload();
		} else {
			httpError(req);
		}
	});
}
function groupDeleted(id) {
	$('.group-' + id).remove();
	$('.accordion').accordion('option', 'active', 0);
}
function productDeleted(groupId) {
	location.reload();
}